<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
</head>
<body>
<form name="myForm">
	<input type="text" name="a">+
	<input type="text" name="b">
	<button>get</button>
	<button>post</button>
	<input type="text" name="sum">
</form>

</body>
<script src="./ajax.js"></script>
<script>
	const btns = document.querySelectorAll("button");
	btns[0].onclick = function(e){
		e.preventDefault();
		const a = document.myForm.a.value.trim();
		const b = document.myForm.b.value.trim();
		// 1
		// ajax({
		// 	url:"/info",
		// 	params:{
		// 		a,
		// 		b
		// 	}
		// }).then(({sum})=>{
		// 	document.myForm.sum.value = sum;
		// })
		
		// 2
		ajax.get("/info",{
			params:{
				a,
				b
			}
		}).then(({sum})=>{
			document.myForm.sum.value = sum;
		})
	};
	btns[1].onclick = function(e){
		e.preventDefault();
		const a = document.myForm.a.value.trim();
		const b = document.myForm.b.value.trim();
		// 1
		// ajax({
		// 	url:"/info",
		// 	method:"post",
		// 	// data: 如果值是一个对象，那么请求体的格式为application/json
		// 	// data: 如果值是一个字符串，那么请求体的格式为application/x-www-form-urlencoded
		// 	data:{
		// 		a,
		// 		b
		// 	},
		// }).then(({sum})=>{
		// 	document.myForm.sum.value = sum;
		// 	// console.log(value);// 响应体
		// })
		
		// 2
		ajax.post("/info","a="+a+"&b="+b).then(({sum})=>{
			document.myForm.sum.value = sum;
		})
	}
</script>
</html>